<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
  </style>
  <script>

    // console.log(1);
    // onload = function(){
    //   // console.log("浏览器加载完成")
    //   var box = document.getElementById("box");
    //   console.log(box);
    // }
    // console.log(2);
    
  </script>
</head>
<body style="width: 2000px;">
  <div id="box"></div>
  <img id="img" src="https://cas.1000phone.net/cas/images/login/logo.png" alt="">
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <h2>标题</h2>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <h2>标题</h2>
  <h2>标题</h2>
</body>
<script>

  // var img = document.getElementById("img");
  // console.log(img);

  // onload = function(){
  //   console.log(img.offsetWidth);
  //   console.log(img.offsetHeight);
  // }







  // onresize = function(){
  //   console.log( document.documentElement.clientWidth )
  //   console.log( document.documentElement.clientHeight )
  // }





  // onscroll = function(){
  //   console.log( document.documentElement.scrollTop )
  //   console.log( document.documentElement.scrollLeft )
  // }


  
  document.onclick = function(){
    // 滚动到指定位置（切换）
    // document.documentElement.scrollLeft = 0;
    // document.documentElement.scrollTop = 666;
    
    // 滚动到指定位置（切换）
    // window.scrollTo(0, 666);
    
    // 滚动到指定位置（滑动）
    window.scrollTo({
      left:0,
      top:666,
      behavior: 'smooth'
    });
  }






</script>
</html>